<template>
  <u-navbar
    back-text=""
    :title="navTitle"
    :background="navBackground"
    back-icon-size="30rpx"
    :is-fixed="true"
    title-color="#000"
    back-icon-color="#000"
  ></u-navbar>
  <view>
    <view v-for="(item, index) in result" :key="index">
      <tpl_block v-if="item.type === 'whiteSpace'" :res="item" />
      <tpl_banner v-if="item.type === 'carousel'" :res="item" />
      <tpl_category
        ref="categoryRef"
        v-if="item.type === 'goodsCategoryFunc'"
        :res="item"
      />
    </view>
  </view>
</template>

<script setup lang="ts">
import { getPageDataByCode } from '@/api/decoration'
import uNavbar from '@/components/navbar/index.vue'
import tpl_banner from '@/pages/v3-template/tpl_banner.vue' //轮播图
import tpl_block from '@/pages/v3-template/tpl_block.vue' //空白
import tpl_category from '@/pages/v3-template/tpl_category_article.vue'
import {
  onLoad,
  onShow,
  onHide,
  onReachBottom,
  onPageScroll
} from '@dcloudio/uni-app'
// import navBg from '@/static/yellow_nav_bg.png'
import config from '@/config/config'
const navBackground = ref({
  background: 'url(' + config.yellowNavBg + ') no-repeat'
})

const result = ref<any>('')
const categoryRef = ref<any>(null)
const navTitle = ref('')
async function init(functionCode: string) {
  const res = await getPageDataByCode(functionCode)
  console.log('获取装修数据', res)

  let foolData = res.data.result.pageData
    ? JSON.parse(res.data.result.pageData)
    : ''
  if (foolData.version) {
    result.value = foolData.data
    console.log(result.value)
  }
}

onMounted(() => {})
onUnmounted(() => {})
onLoad((options: any) => {
  init(options.functionCode)
  navTitle.value = options.functionName || ''
})
</script>
<style>
page {
  background: #fff;
}
</style>
